{% extends "default/admin.html" %}
{% import "bootstrap/wtf.html" as wtf %}

{% block title %}{% if article %}{{ article.title }}{% else %}{{ strs.admin_article_edit.new_title }}{% endif %}{% endblock %}
{% block head %}
{{ super() }}
<link href="{{ url_for('static', filename='default/css/admin_article_edit.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ url_for('static', filename='plug-in/textext/src/css/textext.core.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ url_for('static', filename='plug-in/textext/src/css/textext.plugin.tags.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ url_for('static', filename='plug-in/textext/src/css/textext.plugin.autocomplete.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ url_for('static', filename='plug-in/textext/src/css/textext.plugin.focus.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ url_for('static', filename='plug-in/textext/src/css/textext.plugin.prompt.css') }}" rel="stylesheet" type="text/css" />
<link href="{{ url_for('static', filename='plug-in/textext/src/css/textext.plugin.arrow.css') }}" rel="stylesheet" type="text/css" />
{% endblock %}

{% block page_content %}
<div style="clear:both;"></div>
<div class="write-blog">
    {{ wtf.quick_form(form) }}
    <script src="{{ url_for('static', filename='plug-in/ueditor/ueditor.config.js') }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{ url_for('static', filename='plug-in/ueditor/ueditor.all.min.js') }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{ url_for('static', filename='plug-in/ueditor/ueditor.parse.min.js') }}" type="text/javascript" charset="utf-8"></script>
    <script src="{{ url_for('static', filename='plug-in/ueditor/lang/zh-cn/zh-cn.js') }}" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        var ue = UE.getEditor('body', {
            serverUrl: "/upload"
        });
    </script>
    <div class="form-group">
        <label class="control-label">{{ strs.admin_article_edit.article_tags }}</label>
        <div class="write-tag">
            <input id="tagname" type="text" size="18" autocomplete="off" />
            <input id="addtag" type="button" class="s-button a-button" value="{{ strs.admin_article_edit.add }}" />
        </div>
        <div style="clear: both;"></div>
        <textarea id="tag_display" type="text/plain" style="width: 100%; display: none;"></textarea>
        <script type="text/javascript">
            $('#tag_display').textext({ plugins : 'tags' });
            $('#tagname').textext({
                plugins : 'ajax autocomplete filter',
                ajax : {
                    url : 'http://7xjrbh.com1.z0.glb.clouddn.com/system/data/globaltag.json',
                    dataType : 'json',
                    cacheResults : true
                }
            });

            (function()
            {
                var $tag_display = $('#tag_display'),
                    $output   = $('#tag_list');
                var initData = {% if article %}{{ article.tag_list | safe }}{% else %}{{ '[""]' | safe }}{% endif %};

                $tag_display.ready(function () {
                    $tag_display.textext()[0].tags().addTags(initData);
                });
                $tag_display.bind('setFormData', function(e, data, isEmpty)
                {
                    var textext = $(e.target).textext()[0];
                    $output.val(textext.hiddenInput().val());
                });

                // force this for the sake of the example so that we get one extra
                // `setFormData` event fire and we would set the #output value
                $tag_display.textext()[0].getFormData();
                $('#tagname').bind('keydown', function(e) {
                     if(e.keyCode==13){
                        e.preventDefault();
                        if(!$('#tagname').textext()[0].autocomplete().isDropdownVisible()) {
                            $tag_display.textext()[0].tags().addTags([ $('#tagname').val()]);
                            $('#tagname').val('');
                            $('#tagname').focus();
                        }
                      }
                });
                $('#addtag').bind('click', function(e)
                {
                    $tag_display.textext()[0].tags().addTags([ $('#tagname').val() ]);
                    $('#tagname').val('');
                });
            })();
        </script>
    </div>
    <div class="form-group">
        <input id="release_article" type="button" value="{{ strs.admin_article_edit.release }}" class="s-button" />
    </div>
</div>
{% endblock %}

{% block scripts %}
{{ super() }}
<script src="{{ url_for('static', filename='default/js/admin_article_edit.js') }}" type="text/javascript"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.core.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.tags.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.autocomplete.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.suggestions.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.filter.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.focus.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.prompt.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.ajax.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='plug-in/textext/src/js/textext.plugin.arrow.js') }}" type="text/javascript" charset="utf-8"></script>
{% endblock %}